feat(tabs): create vertical tabs story#21654
Conversation
✅ Deploy Preview for v11-carbon-web-components ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
✅ Deploy Preview for v11-carbon-react ready!Built without sensitive environment variables
To edit notification comments on pull requests, go to your Netlify project configuration. |
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## main #21654 +/- ##
=======================================
Coverage 95.51% 95.51%
=======================================
Files 582 582
Lines 50410 50410
Branches 6789 6762 -27
=======================================
Hits 48148 48148
Misses 2130 2130
Partials 132 132
Flags with carried forward coverage won't be shown. Click here to find out more. ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
sangeethababu9223
force-pushed
the
feat/tabs-vertical-tab
branch
from
5d6a863 to
b4d0066
Compare
…babu9223/carbon into feat/tabs-vertical-tab
…babu9223/carbon into feat/tabs-vertical-tab
emyarod
left a comment
emyarod
left a comment
There was a problem hiding this comment.
looks good to me! on a side note, should we prevent default behavior on keydown? I noticed the page would also scroll when I used the arrow keys to navigate
Thank you for poiinting this out @emyarod. |
tay1orjones
left a comment
tay1orjones
left a comment
There was a problem hiding this comment.
LGTM, could you add tests?
Hey @tay1orjones , |
7429190
|
Hey there! v11.108.0 was just released that references this issue/PR. |
7 participants
Closes #19761
Adds vertical tabs support to Carbon Web Components, achieving parity with the React implementation.
Changelog
New
cds-tabs-vertical- Wrapper component for vertical tab layoutcustom-heightproperty for manual height controlTesting / Reviewing
In Web Components storybook, Vertical story should be there under Tabs component and the behaviour matches the react version.
Note:
In smaller screens Vertical tabs is expected to match the behaviour of Conatined Tabs. And I did notice a slightly different styling for overflow left and right buttons in WC compared to React. I could create a separate issue for that after doing further research as this a contined tabs specific issue.
PR Checklist
As the author of this PR, before marking ready for review, confirm you:
More details can be found in the pull request guide